<script setup>
  import { ref } from 'vue'
  
  const emits = defineEmits()

  // 表单内容
  const info = ref('')

  const add = () => {
    // 子传父 突发 addItem 所绑定的父亲的函数
    if (!info.value) {
      return alert('please input information')
    }
    // console.log(info.value);
    // 添加
    emits('add-item', info.value)
    // 清空
    info.value = ''
  }
</script>
<template>
  <header class="header">
    <h1>⽐特⼈的记事本</h1>
    <input
      class="new-todo"
      placeholder="What needs to be finished?"
      autofocus
      @keydown.enter="add"
      v-model.trim="info"
    />
  </header>
</template>